<template>
    <div class="msgDetail same-change-oldstyle" >
		<div class="same-head-box">
                <div class="saem-seat-box">
                    <div class="saem-seat-left">
                        <span>当前位置：</span>
						<el-breadcrumb separator-class="el-icon-arrow-right">
							 <el-breadcrumb-item >通知消息</el-breadcrumb-item>
							 <el-breadcrumb-item >通知消息详情</el-breadcrumb-item>
						</el-breadcrumb>
                    </div>
                    <div class="saem-seat-right">
                        <button class="same-search-btns same-search-export" @click="RefreshFun">刷新</button>
                        <!-- <button class="same-search-btns" @click="returnBack">返回</button>	  -->
                    </div>
                </div>
            </div>
        <!-- 头部 -->
        <div class="msgHead">
            <div class="left">
                <p>{{title}}</p>
                <span>时间：{{ctime}}</span>
            </div>
            <div class="right">  
                <button  @click="back()">返回</button>
            </div>
        </div>
        <div class="msgBody" v-html="content"></div>
    </div>
</template>

<script>
    export default {
        name:'msgDetail',
        data: function () {
            return {
                id:this.$route.query.id?this.$route.query.id:'',
                title:"",
                ctime:"",
                content:"",
            }
        },
        // 初始化执行
        created: function () {
            var that = this;
            var id = that.id;
            that.messageDetails(id);
        },
        inject: ['reload'],
        methods: {
          RefreshFun(){
              // 调用reload方法，刷新整个页面
              this.reload()
          },
          //返回
          returnBack(){
              this.$router.back(-1);
          },
            // 返回
          back(){
              this.$router.back(-1)
          },
            // 获取消息列表数据
            messageDetails: function (id) {
                var that = this;
                // ajax请求
                that.$post({
                    url: 'Partner/Message/messageDetails',
                    data: { id:id },
                    success: (data)=> {
                        if (data.code == 1000) {
                            that.title = data.data.title;
                            that.ctime = data.data.ctime;
                            that.content = data.data.content;
                        }
                    }
                })
            },
        },
        watch: function () {

        }
    }

</script>

<style>
    .msgDetail{
        height: 100%;
        width: 100%;
        background-color:#F2F3F3;
    }
    .msgDetail .msgHead{
        margin:0px 40px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom:13px;
   }
    .msgDetail .msgHead .left{
        width: 90%;
    }
    .msgDetail .msgHead .left>p{
        margin-top:20px;
        color:#1A1A1A;
        font-size: 18px;
        margin-bottom: 13px;
        font-weight: bold;
    }
    .msgDetail .msgHead .left>span{
        font-size: 14px;
        color:#9D9D9D; 
    }
    .msgDetail .msgHead .right{
        
    }
     .msgDetail .msgHead .right button{
        cursor: pointer;
        width: 80px;
        height: 40px;
        border:none;
        background-color: #fff;
        border:1px solid #F0F0F0;
        font-size: 16px;
     }
     .msgDetail .msgBody{
        padding:0px 560px 40px 46px ;
     }
     .msgDetail .msgBody .last{
        font-size: 14px;
        text-align: right;
        color:#325384;
        margin:30px 0px;
        font-weight: bold;
     }
     .msgDetail .msgBody>p{
        margin:0;
        color:#000;
        font-size: 16px;
     }
      .msgDetail .msgBody>span{
        display: inline-block;
        font-size: 14px;
        color:#777777;
        margin-bottom: 25px;
        line-height: 16px;
     }
</style>
